<template>
  <div style="text-align: center">
    <!-- <div class="headnav">
      <img src="../../src/assets/images/logo_nobackground.png" class="logo" alt="" />

    </div> -->
    <div style="height=100%-70px">
      <img src="../../src/assets/images/homebg.jpg" class="background" alt="" />

      <DefaultHeader mode="black"></DefaultHeader>



      <div class="title">抱大腿学术搜索</div>
      <div class="sub-title">让学术搜索更简单!</div>

      <div class="input-box">
        <el-dropdown @command="handleCommand" trigger="click" placement="bottom" >
          <el-input placeholder="中外文文献" v-model="searchValue" @keyup.enter.native="goSearch" style="width: 650px; font-size: 17px;" >
            <el-select v-model="select" slot="prepend" placeholder="检索依据" style="width: 120px" >
              <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" >
              </el-option>
            </el-select>

          </el-input>
          <el-dropdown-menu slot="dropdown" style="width: 750px" v-if="showPrefix" >
            <el-dropdown-item v-for="item in results" :key="item" :command="item" v-html="highlight(item)" >
            </el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <el-button class="searchBtn" type="primary" icon="el-icon-search" @click="goSearch" ></el-button>
      </div>
      <div class="choice">
        <span  class="choiceItem1" @click="gotoAdv"
      >高级搜索</span>
        <span class="choiceItem2" @click="gotoScholar">学者检索</span>
      </div>
      <i
        class="el-icon-arrow-down"
        style="font-size: 80px; margin-top: 13%; color: white; font-weight: 400"
        @click="pgdown"
      ></i>
    </div>
    <div class="recommendArticleContainer" id="recommendArticle">
      <p class="recoTitle">——— 猜你喜欢 ———</p>
      <div class="recommendArticle">
        <Articles :articles="recommended_articles"></Articles>
      </div>
    </div>
    <div class="bottomInfoDiv">
      <el-row>
        <el-col :span="4" :offset="4">
          <div>
            <p class="bottomInfo">软工抱大腿队</p>
            <p class="bottomInfo">北航软件学院</p>
            <p class="bottomInfo">2022</p>
          </div>
        </el-col>
        <el-col :span="8" :offset="8">
          <div>
            <p class="bottomInfo"></p>
            <el-button round @click="admin">
              管理员登录
            </el-button>
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script>
//import
import Articles from "./Articles.vue";
// import PageHeader from './PageHeader.vue';
import DefaultHeader from './DefaultHeader.vue';

export default {
  name: "Default",
  components: { Articles ,DefaultHeader},//PageHeader
  data() {
    return {
      activeNameOut: "recommended_articles",
      searchValue: "", //输入框中的内容
      select: '', //检索模式，默认为main
      showPrefix: true,
      results: [],
      options: [
        {
          value: "main",
          label: "主题",
        },
        {
          value: "title",
          label: "篇名",
        },
        {
          value: "abstract",
          label: "摘要",
        },
        {
          value: "field",
          label: "领域",
        },
        {
          value: "author",
          label: "作者",
        },
        {
          value: "affiliation_name",
          label: "作者单位",
        },
        {
          value: "publisher",
          label: "文献来源",
        },
        {
          value: "doi",
          label: "DOI",
        },
      ],

      recommended_articles: [


{
  "id": "53e99784b7602d9701f3e140",
  "title": "Present Situation of China Carbon Fiber Industry and Application of Carbon Fiber",
  "authors": [{
    "name": "JIN Li-guo",
    "org": "China Synthetic Fiber Information Center,Shanghai ,China",
    "id": "53f43eeadabfaedce55686fd"
  }],
  "venue": {
    "raw": "Synthetic Fiber in China",
    "id": "5451a5b7e0cf0b02b5f34856"
  },
  "year": 2022,
  "keywords": ["production technology", "carbon fiber", "present situation in industry", "PAN precursor"],
  "n_citation": 18,
  "page_start": "5",
  "page_end": "10+22",
  "lang": "zh",
  "issue": "10",
  "abstract": "The carbon fiber used PAN as precursor is widely applied in the fields of aerospace,sport goods and other industries. The carbon fiber production bases with more than 10 production plants are formed in Jiangsu,Jilin,Shandong and Shanxi provinces,since the development of carbon fiber in sixties of last century. In recent years,the capacity of China carbon fiber is grown greatly,but actual production is still lower,product quality and stability can not be compared with the foreign one,especially,the quality and quantity of PAN precursor can not be met the requirements of carbon fiber production. China imports large amount of carbon fiber from other countries every year."
},
{
  "id": "53e99784b7602d9701f3e142",
  "title": "Effect of a charged scanned probe microscope tip on a subsurface electron gas",
  "authors": [{
    "name": "M.A. Eriksson",
    "org": "Division of Applied Sciences and Department of Physics, Harvard University, Cambridge, MA 02138, U.S.A.",
    "id": "53f4454cdabfaeb22f4bb228"
  }, {
    "name": "R.G. Beck",
    "org": "Materials Department, University of California-Santa Barbara, Santa Barbara, CA 93106, U.S.A.",
    "id": "53f46ea7dabfaee4dc86eef4"
  }, {
    "name": "M.A. Topinka",
    "org": "Division of Applied Sciences and Department of Physics, Harvard University, Cambridge, MA 02138, U.S.A.",
    "id": "53f458acdabfaedd74e36f6e"
  }, {
    "name": "J.A. Katine",
    "org": "Division of Applied Sciences and Department of Physics, Harvard University, Cambridge, MA 02138, U.S.A.",
    "id": "53f4356fdabfaee2a1cde402"
  }, {
    "name": "R.M. Westervelt",
    "org": "Division of Applied Sciences and Department of Physics, Harvard University, Cambridge, MA 02138, U.S.A.",
    "id": "53f45e3cdabfaee0d9c10223"
  }, {
    "name": "K.L. Campman",
    "org": "Materials Department, University of California-Santa Barbara, Santa Barbara, CA 93106, U.S.A.",
    "id": "53f432aedabfaee02aca3c49"
  }, {
    "name": "A.C. Gossard",
    "org": "Materials Department, University of California-Santa Barbara, Santa Barbara, CA 93106, U.S.A.",
    "id": "53f44d12dabfaee1c0b07a6c"
  }],
  "venue": {
    "raw": "Superlattices and Microstructures"
  },
  "year": 2019,
  "keywords": ["scanning probe microscope", "two dimensional electron gas"],
  "n_citation": 19,
  "page_start": "435",
  "page_end": "440",
  "lang": "en",
  "volume": "20",
  "issue": "4",
  "issn": "Superlattices and Microstructures",
  "doi": "10.1006/spmi.1996.0100",
  "url": ["http://dx.doi.org/10.1006/spmi.1996.0100"],
  "abstract": "Using a cryogenic scanned probe microscope (SPM) one can locally modify the sheet density of a two-dimensional electron gas (2DEG), and image the ballistic flow of electrons through a point contact in the 2DEG located beneath the surface of a GaAs/AlGaAs heterostructure. We calculate the capacitively induced change in sheet density when a charged SPM tip is brought into contact with a semiconductor heterostructure containing a two-dimensional electron gas. A simple scattering model, based on a local change in sheet density, is used to analyze experimental data taken with the SPM method described above."
},
      {
  "id": "53e99784b7602d9701f3e132",
  "title": "Practice Research on Technology Roadmap for Electric Vehicle Industry",
  "authors": [{
    "name": "MO Chou",
    "id": "53f4656bdabfaee2a1daad11"
  }, {
    "name": "CHEN Jiqing",
    "id": "542aa2bbdabfae646d57a5de"
  }, {
    "name": "WEN Zongkong",
    "id": "542eaaa5dabfae3edd524479"
  }, {
    "name": "LAN Fengchong",
    "id": "53f4588cdabfaec09f20e670"
  }, {
    "name": "SUN Daxu",
    "id": "53f43bf3dabfaeee229de8d6"
  }],
  "venue": {
    "raw": "Science and Technology Management Research",
    "id": "5451a5b6e0cf0b02b5f33966"
  },
  "year": 2022,
  "keywords": ["science and technology production", "technology roadmap", "electric vehicle"],
  "page_start": "90",
  "page_end": "95",
  "lang": "zh",
  "issue": "19",
  "abstract": "The method to making technology roadmap is introduced.According to the general idea \" market demand-industry target-technology bulwark-development demand\",the technology roadmap for Guangdong electric vehicle industry is made,and the advice to actualize the roadmap is given.This research will provide the reference for government decision-making and enterprise development."
},

{
  "id": "53e99784b7602d9701f3e135",
  "title": "The effect of metabolites on the determination of total sugar in Jerusalem artichoke fermentation",
  "authors": [{
    "name": "LI Li-li",
    "org": "Yantai Institute of Coastal Zone Research,Chinese Academy of Sciences,Yantai ",
    "id": "542cb9e4dabfae4bbcf6c306"
  }, {
    "name": "WANG Fu-xing",
    "org": "Yantai Institute of Coastal Zone Research,Chinese Academy of Sciences,Yantai ",
    "id": "54409a17dabfae805a6daf24"
  }, {
    "name": "WANG Yi-peng",
    "org": "Yantai Institute of Coastal Zone Research,Chinese Academy of Sciences,Yantai ",
    "id": "542d5ae3dabfae11fc461d13"
  }, {
    "name": "QIN Song",
    "org": "Yantai Institute of Coastal Zone Research,Chinese Academy of Sciences,Yantai ",
    "id": "542bf907dabfae216e61ec0b"
  }],
  "venue": {
    "raw": "Food Science and Technology",
    "id": "5451a5b7e0cf0b02b5f347bf"
  },
  "year": 2022,
  "keywords": ["metabolites", "Jerusalem artichoke", "total sugar", "fermentation"],
  "n_citation": 1,
  "page_start": "90",
  "page_end": "93+97",
  "lang": "zh",
  "issue": "07",
  "abstract": "Determination of total sugar can serve to monitoring the fermentation process of Jerusalem artichoke(Helianthus tuberosus).Anthrone colorimetric method was established for the total sugar determination,followed by the study of the effect of ethanol,butyric acid,lactic acid,1,4-butanediol on the determination of total sugar.The results show that the established determination method of total sugar is stable and repeatable.In addition,ethanol and butyric acid(less than 10%,v/v) have no effect on the determination of total sugar.However,lactic acid and 1,4-butanediol have great effect on the determination of total sugar.Interestingly,the absorbance of inulin solution with lactic acid and 1,4butanediol after anthrone reaction equals to the sum of the absorbance of inulin solution after anthrone reaction and the absorbance of lactic acid or 1,4-butanediol solution after anthrone reaction."
},

{
  "id": "53e99784b7602d9701f3e13a",
  "title": "A Data Mining Based on Rough Set Theory",
  "authors": [],
  "venue": {
    "raw": "Software Guide",
    "id": "5451a5b6e0cf0b02b5f33a16"
  },
  "year": 2022,
  "keywords": ["Data Mining", "Rough Set", "Algorithm", "Rules Extracting"],
  "n_citation": 3,
  "page_start": "104",
  "page_end": "106",
  "lang": "zh",
  "issue": "11",
  "abstract": "Rough set is a mathematical tool to deal with vagueness and imprecise problems.this paper applying various reductive level algorithms to elicit information set,get a rules set eventually.A simulated example on how to create and apply this model is given."
},

        {
          authors: [
            {
              affiliation_id: "",
              affiliation_name: "Independent Researcher",
              author_id: "3323123",
              author_name: "Sergei Belousov",
              order: "1",
            },
            {
              affiliation_id: "",
              affiliation_name: "Independent Researcher",
              author_id: "3323123",
              author_name: "Sergei Belousov",
              order: "1",
            },
          ],
          book_title: "",
          citation_count: "0",
          citation_msg: [],
          conference: {},
          collect_num: 13,
          conference_id: "",
          date: "2021-11-01",
          doctype: "",
          doi: "10.1016/J.SIMPA.2021.100115",
          doi_url:
            "https://dx.doi.org/10.1016/J.SIMPA.2021.100115 Add to Citavi project by DOI",
          fields: [],
          first_page: "100115",
          journal: {
            citation_count: "451567",
            issn: "",
            journalid: "2597175965",
            paper_count: "49431",
            publisher: "",
            rank: "8182",
            webpage: "",
          },
          journal_id: "",
          last_page: "12312",
          paper_id: "3191610454",
          paper_title:
            "mobilestylegan pytorch pytorch based toolkit to compress stylegan2 model mobilestylegan pytorch pytorch based toolkit to compress stylegan2 model",
          publisher: "Elsevier BV",
          rank: "23112",
          reference_count: "12",
          volume: "10",
          year: "2021",
          abstract:
            "Importance In December 2019, novel coronavirus (2019-nCoV)–infected pneumonia (NCIP) occurred in Wuhan, China. The number of cases has increased rapidly but information on the clinical characteristics of affected patients is limited. Objective To describe the epidemiological and clinical characteristics of NCIP. Design, Setting, and Participants Retrospective, single-center case series of the 138 consecutive hospitalized patients with confirmed NCIP at Zhongnan Hospital of Wuhan University in Wuhan, China, from January 1 to January 28, 2020; final date of follow-up was February 3, 2020. Exposures Documented NCIP. Main Outcomes and Measures Epidemiological, demographic, clinical, laboratory, radiological, and treatment data were collected and analyzed. Outcomes of critically ill patients and noncritically ill patients were compared. Presumed hospital-related transmission was suspected if a cluster of health professionals or hospitalized patients in the same wards became infected and a possible source of infection could be tracked. Results Of 138 hospitalized patients with NCIP, the median age was 56 years (interquartile range, 42-68; range, 22-92 years) and 75 (54.3%) were men. Hospital-associated transmission was suspected as the presumed mechanism of infection for affected health professionals (40 [29%]) and hospitalized patients (17 [12.3%]). Common symptoms included fever (136 [98.6%]), fatigue (96 [69.6%]), and dry cough (82 [59.4%]). Lymphopenia (lymphocyte count, 0.8 × 109/L [interquartile range {IQR}, 0.6-1.1]) occurred in 97 patients (70.3%), prolonged prothrombin time (13.0 seconds [IQR, 12.3-13.7]) in 80 patients (58%), and elevated lactate dehydrogenase (261 U/L [IQR, 182-403]) in 55 patients (39.9%). Chest computed tomographic scans showed bilateral patchy shadows or ground glass opacity in the lungs of all patients. Most patients received antiviral therapy (oseltamivir, 124 [89.9%]), and many received antibacterial therapy (moxifloxacin, 89 [64.4%]; ceftriaxone, 34 [24.6%]; azithromycin, 25 [18.1%]) and glucocorticoid therapy (62 [44.9%]). Thirty-six patients (26.1%) were transferred to the intensive care unit (ICU) because of complications, including acute respiratory distress syndrome (22 [61.1%]), arrhythmia (16 [44.4%]), and shock (11 [30.6%]). The median time from first symptom to dyspnea was 5.0 days, to hospital admission was 7.0 days, and to ARDS was 8.0 days. Patients treated in the ICU (n = 36), compared with patients not treated in the ICU (n = 102), were older (median age, 66 years vs 51 years), were more likely to have underlying comorbidities (26 [72.2%] vs 38 [37.3%]), and were more likely to have dyspnea (23 [63.9%] vs 20 [19.6%]), and anorexia (24 [66.7%] vs 31 [30.4%]). Of the 36 cases in the ICU, 4 (11.1%) received high-flow oxygen therapy, 15 (41.7%) received noninvasive ventilation, and 17 (47.2%) received invasive ventilation (4 were switched to extracorporeal membrane oxygenation). As of February 3, 47 patients (34.1%) were discharged and 6 died (overall mortality, 4.3%), but the remaining patients are still hospitalized. Among those discharged alive (n = 47), the median hospital stay was 10 days (IQR, 7.0-14.0). Conclusions and Relevance In this single-center case series of 138 hospitalized patients with confirmed NCIP in Wuhan, China, presumed hospital-related transmission of 2019-nCoV was suspected in 41% of patients, 26% of patients received ICU care, and mortality was 4.3%.",
        },

      ],
    };
  },
  created() {
    this.getInfo();
    this.getRecommend();
  },
  watch: {
    searchValue(newVal, oldVal) {
      if (newVal !== "" && newVal !== oldVal) this.getPrefix();
    },
    select(newVal, oldVal) {
      if (newVal !== "" && newVal !== oldVal) this.getPrefix();
    },
    results(newVal) {
      if (newVal.length > 0) this.showPrefix = true;
    },
  },
  methods: {
    gotoAdv: function () {
      // const userInfo = user.getters.getUser(user.state());
      this.$router.push('/advSearch');
    },
    gotoScholar: function () {
      this.$router.push('/searchAut');
    },
    admin() {
      let routeUrl = this.$router.resolve({
        path: "/admin",
      });
      window.open(routeUrl.href, "_self");
    },
    pgdown:function() {
  window.location.hash = "#recommendArticle";
},
    goSearch: function () {
      if (this.searchValue === "") {
        this.$message.warning("请输入检索词！");
        return;
      }
      this.getLatestSearch();
      let routeUrl = this.$router.resolve({
        path: "/searchRes?" + this.select + "=" + this.searchValue,
      });
      window.open(routeUrl.href, "_self");
    },
    getLatestSearch() {
      console.log("最新推荐文献获取中：");
      if (this.select != "author")
        this.select="main";
      const formData={
              name:this.searchValue,
              normalSearchOption:this.select,
          }
          this.$axios({
            method:'post',
            url:'http://117.78.4.242/api/search/normalSearch/latestFilter/',
            data:JSON.stringify(formData)
          }).then(response=>{
            this.recommended_articles=response.data.articles;
            console.log(response.data)
            console.log("消息已收到")
          })
    },
    handleCommand(value) {
      let routeUrl = this.$router.resolve({
        path: "/searchRes?" + this.select + "=" + value,
      });
      window.open(routeUrl.href, "_self");
    },

    highlight(src) {
      let value = src;
      let key = this.searchValue;
      if (!value || !key) return "";
      if (value.length > 100) {
        return value.slice(0, 100) + "...";
      }
      let start = value.toLowerCase().indexOf(key.toLowerCase());
      if (start !== -1) {
        return value.replace(
          value.slice(start, start + key.length),
          `<font color='#1e90ff' style='font-weight: bold'">${value.slice(
            start,
            start + key.length
          )}</font>`
        );
      } else {
        return value;
      }
    },

    getPrefix() {
      console.log("gettingPrefix");
      console.log("this.searchValue"+this.searchValue);
      console.log("this.select"+this.select);
        const formData={
              name:this.searchValue,
              normalSearchOption:this.select=="author"?"author":"main",
        }
          this.$axios({
            method:'post',
            url:'http://117.78.4.242/api/search/normalSearch/getPrefix/',
            data:JSON.stringify(formData)
          }).then(response=>{
            this.results = response.data.items;
            console.log(this.results);
            console.log(response.data)
            console.log("消息已收到")
          })
          .catch((err) => {
            console.log(err);
          });
    },
    /* getInfo() {
      let self = this;
      this.$axios
        .all([this.getStat(), this.getHot()])
        .then(
          this.$axios.spread(function (statDetail, recomDetail) {
            if (statDetail.data.success) {
              self.statistic = statDetail.data;

              self.statistic.fields_count =
                self.statistic.fields_count.toLocaleString();
              self.statistic.affiliation_count =
                self.statistic.affiliation_count.toLocaleString();
              self.statistic.author_count =
                self.statistic.author_count.toLocaleString();
              self.statistic.journal_count =
                self.statistic.journal_count.toLocaleString();
              self.statistic.paper_count =
                self.statistic.paper_count.toLocaleString();
            } else {
              this.$message.error("系统错误，请联系管理员解决");
            }

            if (recomDetail.data.success) {
              self.top_articles = recomDetail.data.data;
            } else {
              this.$message.error("系统错误，请联系管理员解决");
            }
          })
        )
        .catch((err) => {
          console.log(err);
        });
    },
    getStat() {
      return this.$axios({
        method: "post",
        url: "/count/all/",
      });
    },
    getHot() {
      return this.$axios({
        method: "post",
        url: "/es/query/paper/hot/",
      });
    },
    getRecommend() {
      this.$axios({
        method: "post",
        url: "/es/query/paper/recommend/",
      })
        .then((res) => {
          if (res.data.success) this.recommended_articles = res.data.data;
          else this.$message.error("推荐文献获取失败！");
        })
        .catch((err) => {
          console.log(err);
        });
    }, */
  },
};
</script>

<style scoped>
.choiceItem1{
  font-family: source-han-sans-simplified-c, sans-serif;
  font-size: 25px;
  color: white;
  font-weight: 400;
  letter-spacing: 2px;
  margin-right: 40px;cursor: pointer;
}
.choiceItem2{
  font-family: source-han-sans-simplified-c, sans-serif;
  font-size: 25px;
  color: white;
  font-weight: 400;
  letter-spacing: 2px;
  margin-left: 40px;cursor: pointer;
}
.choice{
  margin-top:20px;

}
.searchBtn{
  margin-left: 30px;
  height:55px;
  width: 80px;
  font-size: 20px;
}
.headnav{
  height:70px;background-color: rgba(240, 248, 255, 0.8);
}
.logo{
  position: absolute;
  left:80px;
  top: 20px;
  height: 44px;
}
.bottomInfo{
  line-height: 10px;
  text-align: left;
  font-size: 14px;
  color:black;
}
.bottomInfoDiv{
  background-color: rgba(240, 248, 255, 0.95);
  width: 100%;
  padding-top: 40px;
  padding-bottom: 40px;
  text-align: center;
}
.recommendArticle{
  margin: 20px 0 60px 0;
  background-color:rgba(240, 248, 255,1);
  width: 70%;
  border-radius: 20px;
  display: inline-block;
  box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.4);
border: 1px solid rgba(187, 187, 187, 1);
padding: 30px 40px 30px 40px;/* 上右下左 */

}
.recoTitle {
  font-family: source-han-sans-simplified-c, sans-serif;
  font-size: 40px;
  padding-top: 30px;
  color: black;
  font-weight: 300;
  text-align: center;
}
.recommendArticleContainer {
  background-color: rgba(240, 248, 255, 0.8);
  width: 100%;
  margin-top: 4%;
  text-align: center;
}

.input-box {
  /* height: 50px; */
  margin-top: 5%;
  text-align: center;
}
.input-box >>> .el-input__inner{
  height: 55px;
}
.background {
  display: block;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1; /* 置于最底 */
  object-fit: cover;
  background-size: cover;
  background-repeat: no-repeat;
}
.title {
  font-family: source-han-sans-simplified-c, sans-serif;
  font-size: 60px;
  margin-top: 10%;
  color: white;
  font-weight: 400;
  text-align: center;
  letter-spacing: 7px;
}
.sub-title {
  font-family: zcool-kuaile,source-han-sans-simplified-c, sans-serif;
  font-stretch: normal;
  font-size: 40px;
  margin-top: 2%;
  color: white;
  font-weight: 300;
  text-align: center;
  letter-spacing: 7px;
}
</style>